/**
 * Created by LJQ on 2018/3/30.
 * info:
 */
import React from "react";
import "./index.scss";
import {
  Form,
  Icon,
  Input,
  Button,
  message,
  Checkbox,
  Select,
  Spin
} from "antd";
import { login, getFactoryList } from "../../httpserver/api/login.js";
import MUtil from "./../../utils/MUtil.jsx";
const _mm = new MUtil();
const FormItem = Form.Item;
const Option = Select.Option;
console.log(_mm.getStorage("factory"));

class Login extends React.Component {
  constructor() {
    super();
    this.state = {
      factoryList: [],
      defaultValue: _mm.getStorage("factory").factoryId || "6510",
      loading: false
    };
  }
  componentWillMount() {
    getFactoryList().then(res => {
      console.log(res);
      let factoryList = [];
      if (res.status === "200" && res.data.length > 0) {
        factoryList = res.data;
      }
      console.log(factoryList);
      this.setState({
        factoryList
      });
    });
  }
  componentDidMount() {}
  handleSubmit(e) {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        this.setState({
          loading: true
        });
        login({
          factoryId: values.factoryId,
          username: values.userName,
          password: values.password
        })
          .then(res => {
            console.log(res.data);
            // 本地存储记录当前选中的工厂
            let factoryList = this.state.factoryList;
            for (let i = 0; i < factoryList.length; i++) {
              if (values.factoryId === factoryList[i].factoryId) {
                _mm.setStorage("factory", factoryList[i]);
              }
            }
            _mm.setStorage("userInfo", res.data);
            this.props.history.push("/home");
            this.setState({
              loading: false
            });
          })
          .catch(err => {
            message.error(err);
            this.setState({
              loading: false
            });
          });
      }
    });
  }
  render() {
    const { getFieldDecorator } = this.props.form;
    return (
      <div className="content">
        <div className="login-title">
          <span>恒逸车辆调度系统</span>
        </div>
        <div className="login">
          <div className="login-form">
            <Form onSubmit={this.handleSubmit.bind(this)}>
              <FormItem>
                {getFieldDecorator("factoryId", {
                  rules: [{ required: true, message: "请选择所属工厂!" }],
                  initialValue: this.state.defaultValue
                })(
                  <Select placeholder="请选择所属工厂" className="sel">
                    {this.state.factoryList.map(item => (
                      <Option value={item.factoryId} key={item.id}>
                        {item.factoryName}
                      </Option>
                    ))}
                  </Select>
                )}
              </FormItem>
              <FormItem>
                {getFieldDecorator("userName", {
                  rules: [{ required: true, message: "请输入用户名!" }]
                })(
                  <Input
                    prefix={
                      <Icon type="user" style={{ color: "rgba(0,0,0,.25)" }} />
                    }
                    placeholder="账号"
                  />
                )}
              </FormItem>
              <FormItem>
                {getFieldDecorator("password", {
                  rules: [{ required: true, message: "请输入密码!" }]
                })(
                  <Input
                    prefix={<Icon type="lock" style={{ fontSize: 13 }} />}
                    type="password"
                    placeholder="密码"
                  />
                )}
              </FormItem>
              <FormItem>
                <Button
                  type="primary"
                  htmlType="submit"
                  className="login-form-button"
                  loading={this.state.loading}
                  style={{ width: "100%" }}
                >
                  登录
                </Button>
              </FormItem>
            </Form>
          </div>
        </div>
      </div>
    );
  }
}
export default (Login = Form.create({})(Login));
